<template>
	<view class="wallet_wrapper">
		<view class="total-asset__wrap">
			<view class="asset_title">账户总资产(PCD)</view>
			<view class="asset_count">{{$util.roundNumber(walletInfo.balance,2)}}</view>
		</view>
		<view class="wallet__view_showAssets">
			<view class="wallet__view_availableAssets">
				<view class="wallet_title">可锁仓(PCD)</view>
				<view class="wallet_count">{{$util.roundNumber(walletInfo.available,2)}}</view>
				<view class="wallet_check" @click="jumpCanLock">查看</view>
			</view>
			<view class="wallet__view_frozenAssets">
				<view class="wallet_title">冻结(PCD)</view>
				<view class="wallet_count">{{$util.roundNumber(walletInfo.hold,2)}}</view>
				<view class="wallet_check" @click="jumpFrozen">查看</view>
			</view>
		</view>

		<view class="wallet__view_removableAssets">
			<view class="wallet__view_removableAssetsShow">
				<view class="extract_icon">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/canExtract.svg"></image>
				</view>
				<view>
					<view class="wallet__text_title">可提资产</view>
					<view class="wallet__text_count">{{$util.roundNumber(walletInfo.get_amount,2)}} PCD</view>
				</view>
			</view>
			<view class="wallet__view_removableAssetsButton">
				<view class="wallet__view_button" @click="Withdraw">提币</view>
				<view class="wallet__view_button" @click="doubleThrow">复投</view>
			</view>
		</view>

		<view class="wallet__view_removableAssets">
			<view class="wallet__view_removableAssetsShow">
				<view class="extract_icon">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/repeat.svg"></image>
				</view>
				<view>
					<view class="wallet__text_title">复投挖矿</view>
					<view class="wallet__text_count">{{$util.roundNumber(walletInfo.again_amount,2)}} PCD</view>
				</view>
			</view>
			<view class="wallet__view_removableAssetsButton">
				<view class="wallet__view_button" @click="TransferWithdraw">转入可提</view>
			</view>
		</view>
		
		<!-- <view class="wallet__view_removableAssets">
			<view class="wallet__view_removableAssetsShow">
				<view class="extract_icon">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/airdrop.svg"></image>
				</view>
				<view>
					<view class="wallet__text_title">空投钱包</view>
					<view class="wallet__text_count">0.00 PCD</view>
				</view>
			</view>
			<view class="wallet__view_removableAssetsButton">
				<view class="wallet__view_button" @click="onAirdropWallet">查看详情</view>
			</view>
		</view> -->
		<!-- v-if="userInfo.baseInfo.is_super" -->
		<view class="wallet__view_removableAssets">
			<view class="wallet__view_removableAssetsShow">
				<view class="extract_icon">
					<image src="https://pcdcoin.oss-cn-chengdu.aliyuncs.com/pcdApp/wallet/airdrop.svg"></image>
				</view>
				<view>
					<view class="wallet__text_title">{{userInfo.baseInfo.super_type==2?"分红资产":"空投资产"}}</view>
					<view class="wallet__text_count">{{$util.roundNumber(walletInfo.paradrop_get_amount,2)}}PCD</view>
				</view>
			</view>
			<view class="wallet__view_removableAssetsButton">
				<view class="wallet__view_button" @click="onAirdropWallet"  v-if="userInfo.baseInfo.super_type==1">空投规则	</view>
					<view class="wallet__view_button  wallet__view_button_black" @click="onAirdropWalletDetails">查看详情</view>
					<!-- <view class="wallet__view_button" @click="onAirdropWalletDetails">查看详情</view> -->
			</view>
		</view>

		<!-- 复投对话框 -->
		<wx-dialog :showDialog="showInvestmentDialog" direction="center">
			<template v-slot:dialogContent>
				<view class="dialog_wrap--repeat">
					<view class="repeat_info">
						<view class="info_item">
							<text>可复投(PCD)</text>
							<text>{{$util.roundNumber(walletInfo.get_amount,2)}}</text>
						</view>
						<view class="info_item">
							<text>提币中(PCD)</text>
							<text>{{$util.roundNumber(extractProcess,2)}}</text>
						</view>
					</view>
					<view class="dialog_header">
						<text>数额</text>
						<text @click="clearInput">清空</text>
						<!-- <text >全部</text> -->
					</view>
					<view class="dialog_content">
						<input type="text" v-model="investmentCount" placeholder="请输入复投数额"/>
						<text @click="setAllAssets">全部复投</text>
					</view>
					<view class="handle_wrap">
						<button type="warn" class="dialog_btn" @click="onInvestmentDialog('confirm')">复投</button>
						<button class="dialog_btn cancel_btn" @click="onInvestmentDialog('cancel')">取消</button>
					</view>
				</view>
			</template>
		</wx-dialog>
		
		<!-- 提示空投钱包 -->
		<wx-dialog :showDialog="showAirdropDialog" direction="center">
			<template v-slot:dialogContent>
				<view class="dialog_wrap--airdrop">
					<view class="dialog_title">温馨提示</view>
					<view class="dialog_content">
						<text>该功能正在完善测试中，将很快对外开放，敬请期待</text>
					</view>
					<button type="warn" class="dialog_btn" @click="onAirdropDialogBtn">确定</button>
				</view>
			</template>
		</wx-dialog>
		
	</view>
</template>
<script>
	import wxDialog from "@/components/wx-dialog/wx-dialog.vue"
	export default {
		data() {
			return {
				walletInfo: {},
				showInvestmentDialog:false,
				showAirdropDialog: false,
				investmentCount:'', 	// 复投数额
				canExtractNumber:'', 	// 可提币
				extractProcess:'',		// 提币中
				userInfo:{}
			}
		},
		onShow() {
			// 获取是不是超级用户
			this.userInfo = uni.getStorageSync('user_info')
			this.getWalletInfo();
			this.getRates();
		},
		onPullDownRefresh() {
			this.getWalletInfo();
		},
		methods: {
			getWalletInfo() {
				this.$api.getWalletInfo({}, res => {
					if (res.data.type == 'ok') {
						this.walletInfo = res.data.message;
					}else{
						uni.showToast({
							title: res.data.message,
							mask: false,
							icon:'none',
							duration: 2000
						});
					}
					uni.stopPullDownRefresh()
				})
			},
			// 利率和可提币
			getRates() {
				this.$api.getRates({}, res => {
					if (res.data.type == 'ok') {
						let result = res.data.message
						// 可提币
						this.canExtractNumber = result.get_amount
						// 提币中数量
						this.extractProcess = result.get_amount_ing
					}else{
						uni.showToast({
							title:res.data.message,
							icon:'none'
						})
					}
				})
			},
			// 跳转可锁仓页面
			jumpCanLock(){
				uni.navigateTo({
					url: '/pages/wallet/lockWarehourse'
				})
			},
			// 跳转冻结页面
			jumpFrozen(){
				uni.navigateTo({
					url: '/pages/wallet/frozenAssets'
				})
			},
			// 跳转到空投主页
			onAirdropWalletDetails(){
				uni.navigateTo({
    				url: '/pages/wallet/airDrop'
				});
			},
			// 跳转到空投规页面
			onAirdropWallet(){
				uni.navigateTo({
    				url: '/pages/wallet/airDropRule'
				});
			},
			// 提币
			Withdraw() {
				uni.navigateTo({
					url: '/pages/wallet/extract'
				})
			},
			// 复投
			doubleThrow() { 
				this.showInvestmentDialog = true
			},
			// 转入可提
			TransferWithdraw(){
				uni.navigateTo({
					url: '/pages/wallet/repeatRecord'
				})
			},
			onInvestmentDialog(arg){
				if(arg === 'confirm'){
					if (this.investmentCount=="" || parseFloat(this.investmentCount) == 0) {
						uni.showToast({
							title: '数额不能为空或0',
							icon: 'none'
						})
						return
					};
					if (parseInt(this.investmentCount) != parseFloat(this.investmentCount)) {
						uni.showToast({
							title: '数额必须为整数',
							icon: 'none'
						})
						return
					};
					this.$api.addAgain({
						number:parseInt(this.investmentCount)
					}, res => {
						if(res.data.type === "ok"){
							this.showInvestmentDialog = false
							this.getWalletInfo();
						}
						uni.showToast({
							title: res.data.message,
							mask: false,
							icon:'none',
							duration: 2000
						});
					})
				}else{
					this.showInvestmentDialog = false
				}
				// 清空输入框
				this.investmentCount = ''
			},
			// 对话框点击全部
			setAllAssets(){
				this.investmentCount = Math.floor(this.canExtractNumber)
			},
			// 对话框清空input
			clearInput(){
				this.investmentCount = ''
			}
		},
		components:{
			wxDialog
		}
	}
</script>


<style lang="scss" scoped>
	.wallet_wrapper{}
	.total-asset__wrap{
		height:389upx;
		display: flex;
		flex-direction:column;
		margin-bottom:150upx;
		background-color:#25263D;
		color: #FFFFFF;
		overflow:hidden;
		.asset_title{
			width:100%;
			margin-top:108upx;
			text-align: center;
			font-size: 14px;
		}
		.asset_count{
			text-align: center;
			font-size: 32px;
		}
	}
	.wallet__view_showAssets {
		position: absolute;
		top:300upx;
		left:4%;
		height: 213upx;
		width: 92%;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		background-image:url('../../static/img/common/assetBg.png');
		background-size:100% 100%;
		box-shadow:0px 8px 10px 0px rgba(0, 0, 0, 0.04);
		border-radius:10upx;

		.wallet__view_availableAssets {
			position: relative;
			width: 50%;
			text-align: center;
		}

		.wallet__view_availableAssets:after{
			@include border__line_bgwhite--right;
		}


		.wallet__view_frozenAssets {
			width: 50%;
			text-align: center;
		}
		
		.wallet_title {
			font-size: 12px;
		}
		.wallet_count{
			font-size: 18px;
			font-weight: 700;
		}
		.wallet_check{
			display: inline-block;
			margin-top:26upx;
			padding:4upx 20upx;
			border:1px solid #176CE2;
			border-radius: 50upx;
			font-size: 10px;
			color:#176CE2;
		}
	}

	.wallet__view_removableAssets {
		display: flex;
		flex-direction: row;
		width:92%;
		height: 190upx;
		margin: 20upx auto;
		box-shadow:0px 8px 10px 0px rgba(0, 0, 0, 0.04);
		border-radius:10upx;
		background-color:#FFFFFF;

		.wallet__view_removableAssetsShow {
			width: 80%;
			display:flex;
			align-items:center;
			justify-content:flex-start;
			overflow:hidden;
			.extract_icon{
				width:120upx;
				height:120upx;
				display:flex;
				align-items:center;
				justify-content:center;
				margin:0 20upx 0 40upx;
				border-radius: 50%;
				background: linear-gradient(to bottom right, #6B6D8F,#25263D);
				box-shadow: 2px 2px 5px rgba(0, 0, 0, .5);
				image{
					width:60upx;
					height:60upx;
				}
			}
			.wallet__text_title {
				font-size: 11px;
			}
			.wallet__text_count {
				font-size: 18px;
				color: #333333;
				font-weight: 700;
			}
		}

		.wallet__view_removableAssetsButton {
			width: 40%;
			display:flex;
			flex-direction:column;
			justify-content:center;
			align-items:center;
			.wallet__view_button {
				width:160upx;
				height:60upx;
				text-align: center;
				line-height: 60upx;
				background-color:#E03E4D;
				border-radius: 54upx;
				color:#FFFFFF;
			}
			.wallet__view_button:nth-child(2){
				background-color:#25263D;
				margin-top:20upx;
			}
			.wallet__view_button_black{
				background-color:#25263D;
			}
		}
	}

	.dialog_wrap--repeat{
		width:80%;
		margin: 0 auto;
		padding: 0 40upx;
		box-sizing: border-box;
		border-radius: 10upx;
		overflow: hidden;
			background-color:#FFFFFF;
			.repeat_info{
				height: 86upx;
				padding: 20upx 0;
				display: flex;
				justify-content: space-between;
				margin-top:44upx;
				background-color: #F5F5F5;
				.info_item{
					width:50%;
					display: flex;
					flex-direction:column;
					justify-content: center;
					align-items: center;
					text:last-child{
						color:#E03E4D;
					}
				}
				.info_item:first-child{
					border-right: 1px solid rgba(0,0,0,0.1);
				}
			}
			.dialog_header{
				margin-top:36upx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				text{
					font-size: 15px;
				}
			}
			.dialog_content{
				position: relative;
				margin-top:40upx;
				input{
					height:50upx;
				}
				text{
					display: block;
					width:150upx;
					height:50upx;
					line-height: 50upx;
					text-align: right;
					position:absolute;
					right:0;
					top:0;
					z-index: 1000;
					color:#E03E4D;
				}
			}
			.dialog_content:after{
					content:"";
					position:absolute;
					bottom:0;
					left:0;
					right:0;
					border-top:1px solid rgba(0,0,0,.1);
					-webkit-transform:scaleY(.5);
					-webkit-transform-origin:0 0;
				}
			.handle_wrap{
				display: flex;
				justify-content: space-between;
				margin:42upx 0 37upx 0;
				.dialog_btn{
					width:43%;
					height: 70upx;
					line-height: 70upx;	
					border-radius: 70upx;
					background-color: #E03E4D;
					font-size: 14px;
				}
				.cancel_btn{
					border:1px solid #E03E4D;
					background-color: #FFFFFF;
					color:#E03E4D;
				}
			}
	}

	.dialog_wrap--airdrop {
		width:80%;
		background-color:#FFFFFF;
		margin:0 auto;
		border-radius: 10upx;
		overflow: hidden;
	
		.dialog_title {
			position: relative;
			height: 100upx;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 15px;
		}
		.dialog_title:after{
		    content:"";
			position:absolute;
		    bottom:0;
		    left:0;
		    right:0;
		    border-top:1px solid rgba(0,0,0,0.1);
		    -webkit-transform:scaleY(.5);
		    -webkit-transform-origin:0 0;
		}
	
		.dialog_content {
			height: 200upx;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			padding:0 60upx;
			text{
				font-size: 15px;
			}
		}
	
		.dialog_btn {
			width: 60%;
			height: 68upx;
			line-height: 68upx;
			margin: 0 auto 30upx auto;
			border-radius: 68upx;
			background-color: #E03E4D;
			font-size: 14px;
		}
	}
</style>
